<template>
  <!--主页布局-->
  <div id="mainlayout">
    <!-- 菜单栏布局-->
    <left>
    </left>

    <!-- 右部分布局-->
    <div id="mainlayout-right" :class="{'fiexd-header': headFixed}">

      <!-- 右边头部布局 -->
      <right-top>
      </right-top>

      <!-- 右边主页布局-->
      <div class="mainlayout-right-main">
      </div>

    </div>


  </div>
</template>

<style lang="scss">
@import '../assets/css/global.scss';
#mainlayout {
  display: flex;
  height: 100vh;
  overflow: hidden;
}
#mainlayout-right {
  position: relative;
  flex: 1;
  overflow: auto;
  background-color: $mainBgColor;
  &.fiexd-header {
    display: flex;
    flex-direction: column;
    .mainlayout-right-main {
      flex: 1;
      overflow: auto;
    }
  }
}
.mainlayout-main-conent {
  margin: 24px;
  position: relative;
}
</style>
